<template>
	<!-- 商品显示 组件 -->
	<view :style="{paddingTop: `${newData.pageUpSpacing}rpx`,paddingBottom: `${newData.pageDownSpacing}rpx`,
	    paddingLeft: `${newData.pageLRSpacing}rpx`,paddingRight: `${newData.pageLRSpacing}rpx`}">
		<view style="">
			<view v-if="newData.showType=='1'&&goodsList&&goodsList.length">
				<goods-card1 :goodsList="goodsList" :gType="gType" :activityId="activityId"></goods-card1>
			</view>
			<view v-else-if="newData.showType=='2'">
				<goods-card2 :goodsList="goodsList" :gType="gType" :activityId="activityId"></goods-card2>
			</view>
			<view class="text-center mTop-20" v-if="gType=='yc'&&!goodsList.length">
				暂无数据
			</view>
		</view>
	</view>
</template>

<script>
	const app = getApp();
	import api from '@/utils/api'
	import goodsCard1 from "./goods-card1.vue";
	import goodsCard2 from "./goods-card2.vue";

	export default {
		components: {
			goodsCard1,
			goodsCard2
		},
		props: {
			value: {
				type: Object,
				default: function() {
					return {
						showType: 'row',
						pageSpacing: 0,
						goodsList: []
					}
				}
			},
			activityId: {},
			gType: {
				type: [String || null],
				default: ''
			}
		},
		data() {
			return {
				theme: app.globalData.theme, //全局颜色变量
				newData: {},
				goodsList: [],
				newGoodsids: [],
				page: {
					current: 1,
					size: 5,
					total: 0
				}
			};
		},
		mounted() {
			
		},
		watch:{
			value:{
				handler(val, oldVal) {
					this.newData = val
					this.goodsList = []
					this.newGoodsids = []
					this.page.current = 1
					this.page.total = 0
					this.getgoodsList()
				},
				immediate: true 
			}
		},
		methods: {		
			// 获取活动商品
			getgoodsList() {
				if (this.newData.goodsList && this.newData.goodsList.length > 0) {
					// 获取id
					let goodsids = []
					this.newData.goodsList.forEach(v => {
						goodsids.push(v.spuId)
					})
					// 分页
					let index = 0
					// this.loadmore = true
					while (index < goodsids.length) {
						this.newGoodsids.push(goodsids.slice(index, index += this.page.size));
					}

					// 请求数据
					this.page.total = this.newData.goodsList.length
					this.getGoods()
				}
			},
			getGoods() {
				if (this.page.current <= this.page.total) {
					if (!this.newGoodsids[this.page.current - 1]) return
					api.getHomepageGoods({
						ids: this.newGoodsids[this.page.current - 1].toString()
					}).then(res => {
						let data = res.data
						this.page.current++
						if (data.length > 0) {
							const goodsList = data.filter(v => {
								return v.shelf == '1' && v.skus && v.skus.length
							})
							this.goodsList = [...this.goodsList, ...goodsList]
							this.getGoods()
						}
					})
				}
			}
		}
	}
</script>

<style scoped lang="scss">


</style>